import React from 'react';
import Style from './MenusView.module.css'
import { Link, NavLink } from 'react-router-dom/cjs/react-router-dom.min';
const MenusView = () => {

  return (
    <div>
      {/* 基本页面跳转： */}
      {/* <ul className={Style.ulList}>
        <li> <Link to={{ pathname: "/coures" }}>课程</Link></li>
        <li> <Link to={{ pathname: "/product" }}>产品列表</Link></li>
        <li> <Link to={{ pathname: "/service" }}>服务</Link></li>
        <li> <Link to={{ pathname: "/about" }}>关于</Link></li>
        <li> <Link to={{ pathname: "/login" }}>登录</Link></li>
      </ul> */}
      {/* 带参数 */}
      <ul className={Style.ulList}>
        <li> <Link to="/coures?sort='语文'">课程1</Link></li>
        <li> <Link to={{ pathname: "/coures", search: "sort='语文'" }}>课程2</Link></li>

        <li> <Link to={{ pathname: "/product", state: { id: 111 } }}>产品列表</Link></li>
        {/* <li> <Link to={{ pathname: "/service" }}>服务</Link></li>
        <li> <Link to={{ pathname: "/about" }}>关于</Link></li>
        <li> <Link to={{ pathname: "/login" }}>登录</Link></li> */}

        <li> <NavLink activeClassName="nav-active" to={{ pathname: "/service" }}>服务</NavLink></li>
        <li> <NavLink activeClassName="nav-active" to={{ pathname: "/about" }}>关于</NavLink></li>
        <li> <NavLink activeClassName="nav-active" to={{ pathname: "/login" }}>登录</NavLink></li>
      </ul>
    </div>
  );
}

export default MenusView;
